<template>
  <el-dialog title="修改" :visible.sync="dialogShow">
    <el-form ref="form" :model="form" label-width="120px" :rules="rules">
      <el-form-item label="微信号" prop="brand_phone">
        <el-input v-model="form.anent_login_name" />
      </el-form-item>
      <el-form-item label="手机号" prop="brand_phone">
        <el-input v-model="form.brand_phone" />
      </el-form-item>
      <el-form-item label="省市区" prop="addressArr">
        <el-cascader
          v-model="form.addressArr"
          :options="options"
          @change="handleChange"
        />
      </el-form-item>
      <el-form-item label="收货地址" prop="address">
        <el-input v-model="form.address" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit('form')">提交</el-button>
        <el-button @click="dialogShow = false">取消</el-button>
      </el-form-item>
    </el-form>
    <!-- <div slot="footer" class="dialog-footer">
      <el-button >取 消</el-button>
      <el-button type="primary" @click="submit">确 定</el-button>
    </div> -->
  </el-dialog>
</template>

<script>
import { regionData, CodeToText } from 'element-china-area-data'
import { checkPhoneNumber } from '@/utils/rules'
import { operationAgent } from '@/api/agent'
export default {
  data() {
    return {
      dialogShow: false,
      form: {
        brand_phone: '',
        address: '',
        sheng: '',
        shi: '',
        qu: '',
        addressArr: [],
        anent_login_name: ''
      },
      agentLev: '',
      activeNames: '',
      options: regionData,
      addressValue: [],
      rules: {
        brand_phone: [
          { required: true, validator: checkPhoneNumber, trigger: 'blur' }
        ],
        address: [
          { required: true, message: '请输入收货地址', trigger: 'blur' }
        ],
        addressArr: [
          { required: true, message: '请选择省市区', trigger: 'change' }
        ]
      },
      phone: '',
      formLabelWidth: '120px'
    }
  },
  methods: {
    handleChange(val) {
      console.log(val)
      const arr = []
      for (const i in val) {
        arr.push(CodeToText[val[i]])
      }
      this.form.sheng = arr[0]
      this.form.shi = arr[1]
      this.form.qu = arr[2]
    },
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          // console.log('submit!')
          if (this.phone === this.form.brand_phone) {
            this.form.phone_status = '0'
          } else {
            this.form.phone_status = '1'
          }
          const data = {
            type: 2,
            pro: this.form
          }
          console.log(data)
          this.operationAgentFun(data)
        } else {
          this.$message.info('请完善必填信息！')
        }
      })
    },
    operationAgentFun(data) {
      operationAgent(data).then(res => {
        // console.log(res)
        if (res.code === 200) {
          this.dialogShow = false
          this.$emit('reloadFun')
          this.$message.success('代理添加成功！')
          this.form = {
            brand_phone: '',
            address: '',
            sheng: '',
            shi: '',
            qu: '',
            addressArr: []
          }
        } else if (res.code === 400) {
          this.$message.warning('代理添加失败，请重新提交！')
        } else if (res.code === 4001) {
          this.$message.warning('微信号重复，请重新录入新的微信号！')
          this.form.brand_login_name = ''
        } else if (res.code === 4002) {
          this.$message.warning('手机号码重复，请重新录入！')
          this.form.brand_phone = ''
        } else if (res.code === 4003) {
          this.$message.warning('身份证号码重复，请重新录入！')
          this.form.people_card_num = ''
        } else {
          this.$message.warning('代理添加失败，请重新提交！')
        }
      })
    }
  }

}
</script>

<style lang="sass" scoped>

</style>
